<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1, user-scalable=0, minimal-ui" charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="css/swiper.css" />
		<link rel="stylesheet" href="css/mint.css">
	</head>
	<script src="js/serverUrl.js"></script>
	<script src="js/vue.js"></script>
	<script src="js/mint.js"></script>
	<script src="js/moment.js"></script>
	<style type="text/css">
		.info-list-item {
			display: flex;
			background-color: #fff;
		}
		
		.item-label{
			font-size: 15px;
			color: gray;
			text-align: center;
			padding-top: 3px;
			padding-bottom: 3px;
		}
		
		.newsTableDiv {
			margin-bottom: 4px;
			padding: 0px 4px;
		}
		.card {
			margin: 0px 0px;
		}
		.info-list-item +.info-list-item{
			margin-top: 2px;
		}
		.itemTop{
			display: flex;
			justify-content: space-between;
		}
	</style>
	<body>
		<div id="app">
			<div id="table" class="card">
                <div v-for="(item,index) in examList" class="trainingItem" style="padding-bottom: 10px;" @click.stop="toOnlineExam(index)">
					<div class="trainingRow">
						<div class="type" :style="{'background-color':item.color}">{{item.typeName}}</div>
						<div class="trainingInfo" > 得分：{{item.correctScore}}</div>
					</div>
					<div class="trainingTitle"><span ><img src="img/exam_icon.png" class="titeImage"></span>{{item.examName}}</div>
					<div class="trainingRow">
						<div class="trainingInfo" > {{item.startTime | formatTime}} -  {{item.endTime | formatTime}}</div>
						<div class="trainingInfo" > {{item.examTime}}分钟</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript">
		var app = new Vue({	
			el: '#app',
			data:{
				examList: [
				]
			},
			filters:{
				formatTime(val){
					if (val == null) {
						return ""
					}
					return moment(val).format("YYYY-MM-DD HH:mm")
				}
			},
			created() {
				window.getExamList = this.getExamList
                window.clear = this.clear
			},
			methods:{
              getExamList (examList){
                  for(var i = 0;i<examList.length;i++){
                      var exam = examList[i]
                      if(exam.examStatus ==99){
                          exam.color = "#5bcba7"
                          exam.typeName = "已交卷"
                      }else {
                          exam.color = "#bdbdbd"
                          exam.typeName = "已缺考"
                      }
                  }
                this.examList = this.examList.concat(examList)
              },
              clear () {
                  this.examList = []
              },
              toOnlineExam (index){
                    var exam = this.examList[index]
                    if(exam.examStatus != 99 ){
                        let params = {
                                  exam:JSON.stringify(exam)
                             }
                        WebViewJavascriptBridge.callHandler('toShowError',params);
                    }else {
                        let params = {
                            onlineExamUserId:exam.onlineExamUserId
                                 }
                        WebViewJavascriptBridge.callHandler('toResultList',params);
                    }
              }
			}
		})	
	</script>
</html>
